import React, { useState, useCallback, useRef, useEffect, useMemo } from 'react'
import { get } from '@/utils/axios'
import { getUrlParams } from '@/utils/util'

import Image3D from '@/components/Images3D/index' 
import DefaultList from '@/components/DefaultList/index' 

export default function (props) {
  const [list, setList]= useState([])
  const [layout, setLayout]= useState({show:false,type: ""})

  useEffect(() => {
    if(!list.length){
      get('/api/pagesInfo')
      .then((response) => {
        setList(response)
        setLayout({show:true,type: getUrlParams()._})
      })
    }
  },[list])


  return (
    layout.show?
    (()=>{
      switch(layout.type){
        case "3dImage": 
          return <Image3D list={list} />
        default :
          return <DefaultList list={list} />
      }
    })()
    : null
  )
}

